<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<link rel="stylesheet" href="css/logo.css" />
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<script src="js/index2.js"></script> 
	<link rel="stylesheet" type="text/css" href="css/center.css">
	<link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.css">
	<title>安全中心——手机验证</title>
</head>
<body>
	<!--页头-->
	<div id="dingdan"></div>
	<!-- 顶部标题 -->
	<div class="bgf5 clearfix">
		<div class="top-user">
			<div class="inner">
				<a class="logo" href="index.html"><li id="logo"></li></a>
				<div class="title">个人中心</div>
			</div>
		</div>
	</div>
	<div class="content clearfix bgf5" style="height: 1200px;">
		<section class="user-center inner clearfix">
			<div id="caidan" style="position: absolute;">
            	
           </div>
			<div class="pull-right">
				<div class="user-content__box clearfix bgf">
					<div class="title">安全中心——手机验证</div>
					<div style="padding:30px 0 0 20px;font-size:20px;">
						<p>您正在对<span id="change_box" style="color:red"></span>进行修改</p>
					</div>
					<div class="step-flow-box">
						<div class="step-flow__bd">
							<div class="step-flow__li step-flow__li_done">
							  <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
							  <p class="step-flow__title-top">手机验证</p>
							</div>
							<div class="step-flow__line step-flow__line_ing">
							  <div class="step-flow__process"></div>
							</div>
							<div class="step-flow__li">
							  <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
							  <p  class="step-flow__title-top">修改</p>
							</div>
							<div class="step-flow__line">
							  <div class="step-flow__process"></div>
							</div>
							<div class="step-flow__li">
							  <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
							  <p class="step-flow__title-top">完成</p>
							</div>
						</div>
					</div>
					<div class="user-setting__form">
						<div class="user-setting__form">
							<div class="form-group">
								<input class="form-control" name="tel" id="tel" type="text" oninput="value=value.replace(/\D+/,'')" maxlength="11">
								<span class="tip-text">手机号</span>
								<span class="error_tip"></span>
							</div>
							<div class="form-group">
							<div class="form-group">
								<input class="form-control" style="width: 170px;display: inline;" name="code" id="code" type="tel" oninput="value=value.replace(/\D+/,'')" maxlength="6">
								<span class="tip-text">验证码</span>
								<span class="error_tip"></span>
								<button id="hqyzm" style="cursor: pointer;">获取验证码<span id="djs"></span></button>
								<span id="code_er" style="color: red;"></span>
							</div>
							</div>
							<div class="user-form-group tags-box">
								<button id="yz" class="btn ">提交</button>
								<a href="#" onclick="back()" role="button" class="but">更换验证方式</a>
							</div>
							<script>
								$(document).ready(function(){
									$('.form-control').on('blur focus',function() {
										$(this).addClass('focus')
										if ($(this).val() == ''){$(this).removeClass('focus')}
									});
								});
							</script>
						</div>
					</div>
				</div>
			</div>
		</section>
	</div>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="udai_welcome.html" class="r-item-hd">
					<i class="iconfont icon-user" data-badge="0"></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_shopcart.html" class="r-item-hd">
					<i class="iconfont icon-cart"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_collection.html" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="issues.html" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>
	<!-- 底部信息 -->
	<div class="footer"  style="position: absolute;top: 1300px;width: 100%;">
		<div class="footer-tags">
			<div class="tags-box inner">
				<div class="tag-div">
					<img src="images/icons/footer_1.gif" alt="厂家直供">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_2.gif" alt="一件代发">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_3.gif" alt="美工活动支持">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_4.gif" alt="信誉认证">
				</div>
			</div>
		</div>
		<div class="footer-links inner">
			<dl>
				<dt>富城百货</dt>
				<a href="temp_article/udai_article10.html"><dd>企业简介</dd></a>
				<a href="temp_article/udai_article11.html"><dd>加入U袋</dd></a>
				<a href="temp_article/udai_article12.html"><dd>隐私说明</dd></a>
			</dl>
			<dl>
				<dt>服务中心</dt>
				<a href="temp_article/udai_article1.html"><dd>售后服务</dd></a>
				<a href="temp_article/udai_article2.html"><dd>配送服务</dd></a>
				<a href="temp_article/udai_article3.html"><dd>用户协议</dd></a>
				<a href="temp_article/udai_article4.html"><dd>常见问题</dd></a>
			</dl>
			<dl>
				<dt>新手上路</dt>
				<a href="temp_article/udai_article5.html"><dd>如何成为代理商</dd></a>
				<a href="temp_article/udai_article6.html"><dd>代销商上架教程</dd></a>
				<a href="temp_article/udai_article7.html"><dd>分销商常见问题</dd></a>
				<a href="temp_article/udai_article8.html"><dd>付款账户</dd></a>
			</dl>
		</div>
		<div class="copy-box clearfix">
			<ul class="copy-links">
				<a href="agent_level.html"><li>网店代销</li></a>
				<a href="class_room.html"><li>U袋学堂</li></a>
				<a href="udai_about.html"><li>联系我们</li></a>
				<a href="temp_article/udai_article10.html"><li>企业简介</li></a>
				<a href="temp_article/udai_article5.html"><li>新手上路</li></a>
			</ul>
			<!-- 版权 -->
			<p class="copyright">
				© 2005-2017 XXX 版权所有，并保留所有权利<br>
				ICP备案证书号：闽ICP备XXX号-2&nbsp;&nbsp;&nbsp;&nbsp;福建省宁德市XXX&nbsp;&nbsp;&nbsp;&nbsp;Tel: XXX&nbsp;&nbsp;&nbsp;&nbsp;E-mail: XXX@qq.com
			</p>
		</div>
	</div>
</body>
</html>
<script type="text/javascript">
	//顶端导入
	$("#dingdan").load("index_head.html");
//	$("#dibu").load("底部页面.html");

//	var userid = sessionStorage.getItem("userid");

	//获得userid//
	function getUserid(cookieName) {
	    var strCookie = document.cookie;
	    var arrCookie = strCookie.split("; ");
	    for(var i = 0; i < arrCookie.length; i++){
	        var arr = arrCookie[i].split("=");
	        if(cookieName == arr[0]){
	            return arr[1];
	        }
	    }
	    return "";
	}
	
	var userid=getUserid("userid");
	
	function getQueryString(name) {
		var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
		var r = window.location.search.substr(1).match(reg);
		if (r != null) {
		return unescape(r[2]);
		}
		return null;
	}
	$(document).ready(function(){
		//填入被修改的信息//
		if(getQueryString("change")=="phone"){
			$("#change_box").html("手机");
		}else if(getQueryString("change")=="email"){
			$("#change_box").html("邮箱");
		}else if(getQueryString("change")=="paswd"){
			$("#change_box").html("登录密码");
		}
		
	})
	function back() {
		var toUrl = "save_center.html?change=" + getQueryString("change");
        $(location).attr('href', toUrl);
	}
 	
	$(function(){//第一步都得写这个
		$(document).on("click",".centers_listm_one_in",function(){
		$(this).next(".gjszmdm").slideToggle().siblings("gjszmdm").slideUp()
		});
	})
	/*$(document).ready(function(){ $('.to-top').toTop({position:false}) });*/
	//菜单//
	memu ();
	function memu ()
	{
	
		var list = "";
		$.ajax({
		    type: "post",//请求方式
		    url: "http://localhost:16111/user/MenuSelect",//上s层的路径
			dataType: "json",
		    data:{},//传值
		    xhrFields:{withCredentials: true},
		    success: function (data)
			{
				var user = eval('(' + JSON.stringify(data.data) + ')');
				
				
				list += '<div class=\"centers_listm_one\">'+
            	'<img src=\"images/zshy.png\"/>'+
                '<a href='+user.memu_url+'><em>'+user.memu_name+'</em></a>'+
            	'</div>';
            	for(var i in user.childMemu)
            	{
            		
            		list +='<div class=\"centers_listm_one_in\">'+
                '<img src=\"images/kouw.png\"/>'+
                '<em>'+user.childMemu[i].memu_name+'</em>'+
                '<b></b>'+
            	'</div>'+
            	'<span class="gjszmdm">';
            		for(var x in user.childMemu[i].childMemu)
            		{
            			if(user.childMemu[i].childMemu[x].memu_name=="宝贝收藏")
            			{
            				list += 
		                '<a href='+user.childMemu[i].childMemu[x].memu_url+'?userid='+sessionStorage.getItem("userid")+' class=\"center_in_self\"  target =\"_blank\"><font>'+user.childMemu[i].childMemu[x].memu_name+'</font></a>';
            			}else if(user.childMemu[i].childMemu[x].memu_name=="我的足迹")
            			{ 	
            				list += 
		                '<a href='+user.childMemu[i].childMemu[x].memu_url+'?userid='+sessionStorage.getItem("userid")+' class=\"center_in_self\" target =\"_blank\"><font>'+user.childMemu[i].childMemu[x].memu_name+'</font></a>';
            			}else 
            			{
            				list += 
		                '<a href='+user.childMemu[i].childMemu[x].memu_url+' class=\"center_in_self\"><font>'+user.childMemu[i].childMemu[x].memu_name+'</font></a>';
            			}
            			
		            	
            		}
            		list+='</span>';
            	} 
            	
            	$("#caidan").html(list);
		   }
		})		
		
	}
	

	//非法填入 变样式
	function upbrcl(z) {
		z.style.borderColor = "#d2d2d2";
		$(z).next().empty();
		$("#code_er").empty();
	}

	//获取验证码
	$("#hqyzm").click(function() {
		$("#tel").next().empty();
		if($("#tel").val() == "") {
			$("#tel").next().append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>手机号为空");
			return false;
		} else if($("#tel").val().length != 11) {
			$("#tel").next().append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>手机格式不对");
			return false;
		} else {

		}

		var yzm = document.getElementById("hqyzm");
		yzm.disabled = true;
		yzm.style.backgroundColor = "ghostwhite"
		yzm.style.color = "gray";
		var i = 60;
		//锁定发送短信按钮
		var z = setInterval(function() {
			document.getElementById("djs").innerHTML = "(" + i + ")";
			if(i == 0) {
				yzm.disabled = false;
				yzm.style.backgroundColor = "#e5e5e5"
				yzm.style.color = "#4C4C4C";
				clearTimeout(z);
				document.getElementById("djs").innerHTML = "";
			}
			i -= 1;
		}, 1000);
		//调用后台发送短信
		$.ajax({
			url: 'http://localhost:16111/user/g_send_dx',
			type: 'post',
			dataType: 'text',
			xhrFields:{withCredentials: true},
			data: {
				tel: $("#tel").val().trim()
			},
			success: function(data) {
				console.log("短信获取成功")
			}
		});

	});
	
	//验证手机
	$("#yz").click(function() {
		$("#tel").next().empty();
		var tel = document.getElementById("tel");
		var code = document.getElementById("code");
		if(tel.value == "") {
			tel.style.borderColor = "red";
			tel.placeholder = "手机号为空 请填写账号";
			$("#tel").next().append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>手机号为空");
		} else if(tel.value.length != 11) {
			tel.value = "";
			tel.style.borderColor = "red";
			tel.placeholder = "手机号格式不对";
			$("#tel").next().append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>手机格式不对");
		} else if(code.value == "") {
			code.style.borderColor = "red";
			code.placeholder = "验证为空"
		} else if(code.value.length != 6) {
			code.style.borderColor = "red";
			$("#code_er").append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>验证码有误")
		} else {
			x();
		}

	});

	function x() {
		$.ajax({
			url: 'http://localhost:16111/user/g_yz_tel',
			type: 'post',
			dataType: 'json',
			xhrFields:{withCredentials: true},
			data: {
				"tel":$("#tel").val(),
				"code":$("#code").val(),
			},
			success: function(data) {
				if(data.code == 1) {
					$("#tel").next().append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>手机号未被注册请前往注册");
				} else if(data.code == -1) {
                    code.style.borderColor = "red";
			        $("#code_er").append("<i class=\"fa fa-times\" aria-hidden=\"true\"></i>验证码有误")
				}else{
					var toUrl = "udai_change_step2.html?change=" + getQueryString("change");
    				$(location).attr('href', toUrl);
				}
			}
		});
	};
	//密码登录//
	function login() {
		$.ajax({
			url: 'http://localhost:16111/user/f_login',
			type: 'post',
			dataType: 'json',
			xhrFields:{withCredentials: true},
			data: {
				"userid":userid,
				"paswd":$("#password1").val(),
			},
			success: function(result) {
				if(result){
					var toUrl = "udai_change_step2.html?change=" + getQueryString("change");
        			$(location).attr('href', toUrl);
	        	}else{
	          		alert("密码错误,请重新再试");                         
		        }
			},
			error:function(jqXHR){
		            alert("密码错误,请重新再试");  	
		        } 
		});
	};
</script>